<template>
    <a-card :bordered="false">
  
  
      <!-- table区域-begin -->
      <div>
  
        <a-table
          ref="table"
          size="middle"
          :scroll="{x:true}"
          bordered
          rowKey="id"
          :columns="columns"
          :dataSource="dataSource"
          :pagination="ipagination"
          :loading="loading"
          :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
          class="j-table-force-nowrap"
          @change="handleTableChange">
  
          <template slot="groupNameSlot" slot-scope="text,record">
            <template>
              <span>
                <a-input v-model="record.groupName" />
              </span>
            </template>
          </template>
  
          <span slot="action" slot-scope="text, record">
            <a v-if="record.id != null"  @click="handleEdit(record)">保存</a>
            <a v-if="record.id == null" @click="handleSave(record)">保存</a>
  
            <a-divider type="vertical" />      
  
            <a-popconfirm v-if="record.id != null" title="确定删除吗?" @confirm="() => DeleteRow(record)">
                    <a>删除</a>
            </a-popconfirm>
  
            <a v-if="record.id == null"   @click="CancelAdd(record)">取消</a>
          </span>
  
        </a-table>
  
        <div style="color:blue;cursor: pointer;" @click="addRow()"  >
          +添加分组
        </div>
  
  
  
      </div>
  
  
  
    </a-card>
  
  
  </template>
  
  <script>
  
    import '@/assets/less/TableExpand.less'
    import { mixinDevice } from '@/utils/mixin'
    import { JeecgListMixin } from '@/mixins/JeecgListMixin'
    import {deleteAction, postAction,getAction} from '@api/manage'
  
  
    export default {
      name: 'CyEmissionUnitList',
      mixins:[JeecgListMixin, mixinDevice],
      data () {
        return {
          description: '碳排因子单位管理页面',
          // 表头
          columns: [
            {
              title:'分组名称',
              align:"center",
              dataIndex: 'groupName',
              key:'groupName',
              scopedSlots: { customRender: 'groupNameSlot' }
            },
            {
              title: '操作',
              dataIndex: 'action',
              key:'action',
              align:"center",
              fixed:"right",
              width:147,
              scopedSlots: { customRender: 'action' }
            }
          ],
          url: {
            list: "/CyFactorUnitGroup/cyFactorUnitGroup/list",
            add: "/CyFactorUnitGroup/cyFactorUnitGroup/add",
            delete: "/CyFactorUnitGroup/cyFactorUnitGroup/delete",
            deleteBatch: "/CyEmissionUnit/cyEmissionUnit/deleteBatch",
            exportXlsUrl: "/CyEmissionUnit/cyEmissionUnit/exportXls",
            importExcelUrl: "CyEmissionUnit/cyEmissionUnit/importExcel",
            edit: "/CyFactorUnitGroup/cyFactorUnitGroup/edit"
            
          },
          dictOptions:{},
          superFieldList:[],
          //单位分组集合
          unitGroupList: [],
          dataSource: [],
          show:false,
          doing:false,
          ipagination: {
          current: 1,       //当前页码
            pageSize: 10,    //当前页面查询数
            pageSizeOptions: ['10', '20', '30', '40'],
            // showTotal: (total, range) => `总数:${total} 当前页: ${range[0]}-${range[1]} ` + `每页显示: ${this.ipagination.pageSize}`, // 分页中显示总的数据
            showQuickJumper: true,
            showSizeChanger: true,
            total: 0  //   记录总数
        },

        }
      },
  
      created() {
      this.getSuperFieldList();
      this.searchGroup();
      },
      computed: {
        importExcelUrl: function(){
          return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
        },
      },
      methods: {
        initDictConfig(){
        },
        getSuperFieldList(){
          let fieldList=[];
          fieldList.push({type:'string',value:'unitName',text:'单位名称',dictCode:''})
          fieldList.push({type:'string',value:'unitCode',text:'单位',dictCode:''})
          fieldList.push({type:'string',value:'parentId',text:'父类ID',dictCode:''})
          this.superFieldList = fieldList
        },
        searchQuery(){
          getAction(this.url.list).then(res=>{
            this.dataSource = res.result.records
          console.log(res);})
        },
        searchGroup(){
          getAction(this.url.unitGroup).then(res=>{
            this.unitGroupList = res.result.records
        })
        },
        addRow(){
          this.dataSource.push({})
        },
        DeleteRow(record){
          deleteAction(this.url.delete,{id:record.id}).then(res=>{
            if(res.code == 200){
              this.$message.success(res.message)
              this.ipagination.total =res.result.total
            }else{
              this.$message.warning(res.message)
            }
            })
          
            this.searchQuery()  
  
  
        },
        CancelAdd(record){
          this.dataSource.pop(record)
        },
        handleSave(record){
  
          if(record.groupName == null || record.groupName == ""){
            this.$message.warning("分组名称不能为空")
          }else{
          //防止连续点击
          if(this.doing){     
            alert("上一个操作未完成");
          }else{
            this.doing = true
            postAction(this.url.add,record).then(res=>{
            this.doing = false
            if(res.success){
              this.$message.success(res.message)
              this.ipagination.total =res.result.total
              this.searchQuery()
            }
          })}
          }
        },
        handleEdit(record){
           postAction(this.url.edit,record).then(res=>{
               if(res.code == 200){
                this.$message.success(res.message)
               }
           })
        }
      }
    }
  </script>
  <style scoped>
    @import '~@assets/less/common.less';
  </style>